<template>
    <div class="box1 bordert">
        <div class="ttitle">我的邀请</div>
        <div class="num">
            <span>邀请人数：</span>
            <span>{{ vlist.length }}人</span>
        </div>
        <div class="invlists">
            <div class="invtable">
                <table class="tablet" width="90%" align='center' border="1px solid" bordercolor="#D9D9D9" cellspacing="0" cellpadding="0" style="border-collapse:collapse;">
                    <tr class="invtitle">
                    <th>被邀请人</th>
                    <th>推广时间</th>
                    </tr>
                    <tr v-for="(item, index) in vlist" :key="index">
                    <td style='height:40px;' align='center' valian='middle'>{{ item.mobile }}</td>
                    <td style='height:40px;' align='center' valian='middle'>{{ item.createDate }}</td>
                    </tr>
                    <!-- <tr>
                    <td>row 2, cell 1</td>
                    <td>row 2, cell 2</td>
                    </tr> -->
                </table>
            </div>
            <div style="height:500px"></div>
        </div>
    </div>
</template>
<script>
export default {
  data () {
    return {
        vlist: []
    }
  },
  created() {
    //   console.log('邀请')
    //   this.huoquyaoqin()
  },
  mounted() {
      this.huoquyaoqin()
  },
  methods: {
      async huoquyaoqin() {
          var id = ''
          id = JSON.parse(window.localStorage.getItem('yonghuxinxi')).id
          console.log(id)
          var uid = new FormData()
          uid.set('userId',id)
          const { data: res } = await this.$http.post('app/user/getParentId',uid)
        console.log(res)
        if (res.code !== 0) return console.log('获取邀请失败')
        console.log('获取邀请成功')
        this.vlist = res.data
      }
  }
  }
</script>
<style lang="less" scoped>
@import "../../assets/css/index.css";
    .box1 {
        background-color: #fff;
        .num {
            height: 50px;
            border-top: 1px solid #F1F1F1;
            line-height: 50px;
            padding-left: 20px;
        }
        .invlists {
            .invtable {
                // text-align: center;
                .tablet {
                    color: #696969;
                    margin:auto;
                    .invtitle {
                    background-color: #F3F3F3;
                    height: 50px;
                }
                }
            }
        }
    }

</style>